<template>
	<view class="container">
		<record-item class="item" v-for="item in dataList" :key="item.id" :data="item"></record-item>
		<uniLoadMore :loadingType="loadingType" :contentText="contentText"></uniLoadMore>
	</view>
</template>

<script>
	import {
		depositCoin
	} from '@/api/wallet';
	import RecordItem from "./components/record-item";
	import uniLoadMore from '@/components/uni-load-more.vue';
	import base64Code from '@/plugin/base64code.js';
	export default {
		name: "contract",
		components: {
			RecordItem,
			uniLoadMore
		},
		data() {
			return {
				coin: '',
				detailData: {},
				page: 1,
				total:0,
				dataList: [],
				loadingType: 0
			}
		},
		onLoad(e) {
			this.coin = e.coin;
		},
		onReady() {
			uni.setNavigationBarTitle({
				title: this.coin + this.$t('my.charge.record')
			});
		},
		onShow() {
			
		},
		created() {
			this.getDataList();
		},
		computed:{
			contentText(){
				return{
					contentdown: this.$t('info.contentText.contentdown'),
					contentrefresh: this.$t('info.contentText.contentrefresh'),
					contentnomore: this.$t('info.contentText.contentnomore')
				}
			}
		},
		methods: {
			getDataList(bol) {
				this.loadingType = 1;
				var time = Math.round(new Date().getTime() / 1000);
				var data = {
					coin: base64Code.adds(time, this.coin),
					page: base64Code.adds(time, this.page),
					time: time
				}
				depositCoin(data).then((res) => {
					if (res.code = 1000) {
						if (bol) {
							this.dataList = [];
						}
						this.total = res.data.total
						let arr = res.data.model
						this.dataList.push(...arr)
					} else {
						this.loadingType = 3
						this.dataList = [];
					}
				}).catch(() => {
					this.loadingType = 3
					this.dataList = [];
				})
			},
			onPullDownRefresh() {
				this.page = 1;
				this.loadingType = 0;
				this.getDataList(true);
				uni.stopPullDownRefresh()
			}
		}
	}
</script>

<style scoped lang="scss">
	page {
		background: $hb-bg;
	}

	.container {
		box-sizing: border-box;
		background: $hb-bg;
		padding: 20rpx;
		min-height: 100%;
		color: #fff;

		.item {
			margin-bottom: 20rpx;
		}

		.order-details-pop {
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: rgba(0, 0, 0, 0.4);
		}
	}
</style>
